<template>
	<div id="box">
		<el-form :model="editFrom" :rules='rules'  ref="child" label-width="160px">
		<el-row :gutter="20">
  		<el-col :span="12">
  		<el-form-item label="姓名" prop="name" style='width:460px' >
		<el-input v-model="editFrom.name"></el-input>
		</el-form-item>
		<br>
		<el-form-item label="性别" prop="sex" style='width:460px' >
		<el-radio-group v-model="editFrom.sex">
		<el-radio border label="男"></el-radio>
		<el-radio border label="女"></el-radio>
		</el-radio-group>
		</el-form-item>
		<br>
		<el-form-item label="员工编号" prop="number" style='width:460px' >
		<el-input v-model="editFrom.number" disabled></el-input>
		</el-form-item>
		<br>
		<el-form-item label="登录密码" prop="password" style='width:460px' >
		<el-input v-model="editFrom.password"></el-input>
		</el-form-item>
		<br>
		<el-form-item label="联系电话" prop="tel" style='width:460px' >
		<el-input v-model="editFrom.tel"></el-input>
		</el-form-item>	
  		</el-col>
  		<el-col :span="12">
  		<el-form-item label="基本工资" prop="base_salary" style='width:460px' >
		<el-input v-model="editFrom.base_salary" disabled></el-input>
		</el-form-item>
  		<el-form-item label="身份证" prop="id_card" style='width:460px' >
		<el-input v-model="editFrom.id_card"></el-input>
		</el-form-item>
		<el-form-item label="部门" prop="store_name" style='width:460px' >
		<el-select v-model="editFrom.store_name" placeholder="选择部门" disabled>
		<el-option v-for='(item,index) in storeSelect' :label="item" :value="item" :key='index'></el-option>
		</el-select>
		</el-form-item>
		<el-form-item label="职位" prop="job_name" style='width:460px' >
		<el-select v-model="editFrom.job_name" placeholder="选择职位" disabled>
		<el-option v-for='(item,index) in jobSelect' :label="item" :value="item" :key='index'></el-option>
		</el-select>
		</el-form-item>
		<el-form-item label="权限级别" prop="role_name" style='width:460px' >
		<el-select v-model="editFrom.role_name" placeholder="选择职位" disabled>
		<el-option v-for='(item,index) in roleSelect' :label="item" :value="item" :key='index'></el-option>
		</el-select>
		</el-form-item>
  		</el-col>
		</el-row>
		<el-form-item>
		<el-button type="primary" @click="submitForm('child')">确认修改</el-button>
		<el-button @click="tuichu">退出</el-button>
		</el-form-item>
		</el-form>
	</div>
</template>
<script>
	import reg from '@/tool/reg'
	import {mapGetters,mapActions} from 'vuex'
	export default{
		name:'edit',
		data(){
			return{
				rules:{
					name:[
						{ required: true, message: '姓名不能为空!', trigger: 'blur' },
					],
					// id_card:[
					// 	{required: true,validator:reg.id_card,trigger:'blur'}
					// ],
					number:[
						{ required: true, message: '姓名不能为空!', trigger: 'blur' },
					],
					password:[
						{ required: true, message: '姓名不能为空!', trigger: 'blur' },
					],
					// tel:[
					// 	{required: true,validator:reg.phone,trigger:'blur'}
					// ],
					base_salary:[{required: true, message: '基础工资不能为空!', trigger: 'blur'}]
				},
				editFrom:{
					name:'张三',
					sex:'男',
					number:'9876',
					password:'123456',
					tel:'12345678901',
					base_salary:'2000',
					id_card:'123456789010',
					store_name:'异步',
					job_name:'前段开发',
					role_name:'垃圾'
				}
			}
		},
		methods:{
			...mapActions(['edityg']),
			submitForm(formName) {
        		this.$refs[formName].validate((valid) => {
          			if (valid) {
          				console.log(this.editFrom)
          				this.editFrom.update_by = sessionStorage.getItem('name')
          				let obj = {
          					number:9527,
          					id_card:123456789010,
          					base_salary:2000,
          					tel:12345678901,
          					store_name:'服务部门',
          					job_name:'服务员',
          					role_name:'服务员',
          					update_by:'赵六',
          				}
          				this.$message({
          					showClose: true,
          					message: '修改成功!',
          					type: 'success'
        				});
          				// for (let key in obj){
          				// 	obj[key] = this.editFrom[key]
          				// }
          				// this.edityg(obj).then(res=>{
          				// 	console.log(res)
          				// 	if(res === '200'){
          				// 		this.$emit('text',this.editFrom)
          				// 		this.$emit('close')
          				// 		this.log('修改了员工'+this.editFrom.name+'的数据')
          				// 	}else{
          				// 		this.$message({
          				// 			showClose: true,
          				// 			message: '修改失败!',
          				// 			type: 'error'
        						// });
          				// 	}
          				// })	
          			} else {
            			console.log('error submit!!');
            			return false;
          			}
        		});
      		},
      		tuichu(){
      			this.$router.go(-1)
      		}
		},
		computed:{
			...mapGetters(['jobSelect','roleSelect','storeSelect']),
		}

	}
</script>
<style scoped lang="less">
	#box{
		height: 460px;
	}
</style>